<template>
   <div>
        <img :src="User.headphoto" class="headphoto" v-if="User">
        <button class="flex" @click="openDiscuss()">留下精彩的评论吧!</button>

   </div>
</template>
<script>
import { mapMutations, mapState } from 'vuex'
  export default 
  {
     name :'', 
     data() {
        return {
             timer:null,
             time:0
        }
     },
     computed:{
        ...mapState('Login',['User']),
        ...mapState('ArticleDetail',['ArticleDetail'])
     },
     methods:{
         ...mapMutations('Discuss',['DISCUSSON']),
          TimeKeeping(fun){ //计时
           clearTimeout(this.timer)
           this.timer = setTimeout(() => {
               this.time = 0
               clearTimeout(this.timer)
             },3000);
        },
         openDiscuss(){
             if(this.User == null)  return this.$public.toLogin()
            this.time +=1
            this.TimeKeeping()
            if(this.time >=4) return this.$message.warning('请勿频繁操作')
             let data = {id:this.ArticleDetail.id}
             data.type=1
             data.discussTitle='评论文章 ' +  this.ArticleDetail.title
             this.DISCUSSON(data)
         }
     }
  }
</script>
<style scoped lang='less'>
img{
    margin-right: 10px;
}
button{
    width: 100%;
    border-radius: 5px;
    background: #efefef;
   color: #000;

    font-size: 18px;
    padding:  10px;
    box-sizing: border-box;
    justify-content: flex-start;

    
}
</style>